<div class="rightcontent rc-bg-grey">
    <div class="rc-pagepadding">


        <div class=" rc-pannel ">
            <div class=" rc-pannel-header">
                <div class="rc-flex layui-form toolbar rc-flex-justify-between">
                    <div class=" rc-flex rc-flex-vertical-center ">

                    </div>
                    <div>
                        <a href=" /admin/cnf/UcenterMenu/add" class="layui-btn layui-btn-primary layui-btn-sm"><i class="iconfont">&#xe60e;</i> 添加菜单</a>

                    </div>
                </div>
            </div>


            <div class="rc-pannel-body layui-form rc-pagepadding">

                <table class="layui-hide" id="menus"></table>



            </div>
        </div>
    </div>
</div>

<script type="text/html" id="op-tools">
    <div class="rc-opbar">

        <a class="info" lay-event="edit"><i class="iconfont">&#xe606;</i> 编辑</a>
        <a class="error delete" lay-event="delete"><i class="iconfont">&#xe607;</i> 删除 </a>



    </div>
</script>
<script>
    layui.use(function() {
        var layer = layui.layer;
        var form = layui.form;
        var treeTable = layui.treeTable;





        var inst = treeTable.render({
            elem: '#menus',
            treeColIndex: 1,
            url: '/admin/cnf/UcenterMenu/index?type=selmenus', // 此处为静态模拟数据，实际使用时需换成真实接口
            tree: {
                view: {
                    expandAllDefault: false,
                    iconLeaf: '<i class="layui-icon layui-icon-file"></i>'
                },
                customName: {
                    name: 'title'
                }
            },
            cols: [
                [{
                        field: 'title',
                        title: '导航名',
                        width: 280,
                        fixed: 'left'
                    },
                    {
                        field: 'ident',
                        title: '标识',
                        width: 280,
                    },
                    {
                        field: 'url',
                        title: '跳转地址',
                    },

                    {
                        field: 'target',
                        title: '打开方式',
                        templet: function(d) {

                            if (d.target === '_blank') {
                                return '<span style="color: blue">新窗口</span>';

                            } else {

                                return '<span >本窗口</span>';

                            }
                        },
                        width: 120,
                    },

                    {
                        fixed: "right",
                        title: "操作",
                        width: 190,
                        align: "center",
                        toolbar: "#op-tools"
                    }

                ]
            ],

            page: false,


        });

        treeTable.on('tool(' + inst.config.id + ')', function(obj) {
            var layEvent = obj.event; // 获得 lay-event 对应的值
            if (layEvent === "edit") {
                window.location.href = '/admin/cnf/UcenterMenu/edit?id=' + obj.data.iid;

            }
            if (layEvent === "delete") {
                layer.confirm('删除会连同子级一同删除，确定要删除么？', {
                    icon: 3
                }, function() {
                    $.ajax({
                        url: '/admin/cnf/UcenterMenu/delete?id=' + obj.data.iid, //请求路径
                        type: "POST", //请求方式
                        success: function(data) {
                            if (data.code == 0) {
                                window.location.reload();
                            } else {
                                toastr_error(data.message);
                            }
                            layer.closeAll();
                        },
                        error: function() {
                            layer.closeAll();
                        },

                    });


                }, function() {



                });

            }
        })

    });
</script>